<template>
	<view>
		<uni-nav-bar :fixed="true" :border="false" background-color="none" title="" status-bar>
					<template v-slot:left>
						<up-icon @click="onClickLeft" name="arrow-left"  size="36rpx"></up-icon>
						<!-- <image @click="handleBackHome" style="width: 48rpx; height: 48rpx; margin-left: 24rpx;" src="/static/image/home-icon.png" mode="aspectFit"></image> -->
					</template>
				</uni-nav-bar>
		<view class="flex justify flex-down align-items" style="margin-top: 24rpx;">
			<image src="https://static-tool.77.top/static/login-logo.png" mode="aspectFill"
				style="width: 193rpx;height:193rpx"></image>
			<image src="https://static-tool.77.top/static/login-title.png" mode=""
				style="width: 316rpx;height: 48rpx;margin-top: 8rpx;"></image>
			<view class="kazu">
				登录后可收藏卡组，体验更多功能
			</view>
			<button class="buttons" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">手机一键登录</button>
			<view class="flex align-items" style="margin-top: 16rpx;">
				<image v-if="show==false" src="../../static/image/Component285.png" mode=""
					style="width: 24rpx;height:24rpx" @click="show=!show"></image>
				<image v-if="show==true" src="../../static/image/Frame1000008593.png" mode=""
					style="width: 24rpx;height:24rpx" @click="show=!show"></image>
				<view class="flex align-items" style="font-size: 20rpx;margin-left: 8rpx;">
					<view>我已同意同意 </view>
					<navigator url="service" style="color:#FD8B00">《Hearthstone用户协议》</navigator>和
					<navigator url="privacy" style="color:#FD8B00">《隐私政策》</navigator>
				</view>
			</view>
		</view>
	</view>
</template>

<script setup>
	import {
		reactive,
		ref
	} from 'vue'
	import request from "/http/index.js"
	import {
		onLoad,
		onReady
	} from "@dcloudio/uni-app"
	const onClickLeft = () => {
			uni.switchTab({
				url: '/pages/home/index'
			})
	}
	const show = ref(false)
	const show2 = ref(false)
	const openid = ref()
	const gologin = () => {
		request({
			url: 'manager/deck/comments',
			method: 'POST',
			data: {
				pagesize: 10,
				page: 1
			}
		}).then(res => {
		})
	}
	const getPhoneNumber = (e) => {
		if (show.value == false) {
			return uni.showToast({
				title: '请阅读并同意Hearthstone相关协议',
				icon: 'none'
			})
		}
		uni.login({
			success(res) {
				if (res) {
					request({
						url: 'api/user/authSession',
						method: 'get',
						data: {
							code: res.code
						}
					}).then(ress => {
						uni.setStorageSync("token", ress.data.userInfo.token)
						uni.setStorageSync("avatar", ress.data.userInfo.avatar)
						uni.setStorageSync("username", ress.data.userInfo.username)
						setTimeout(() => {
							uni.navigateBack()
						}, 100)
						if (!ress.data.userInfo.token) {
							request({
								url: 'api/user/loginForWechatMini',
								method: 'POST',
								data: {
									iv: e.detail.iv,
									encryptedData: e.detail.encryptedData,
									openid: ress.data.openid

								}
							}).then(cses => {
								uni.setStorageSync("token", cses.data.token)
								uni.setStorageSync("avatar", cses.data.avatar)
								uni.setStorageSync("username", cses.data.username)
								setTimeout(() => {
									uni.navigateBack()
								}, 100)
							})
						}
					})
				} else {
					console.log('登录失败！' + res.errMsg)
				}
			}
		})
	}
</script>

<style scoped>
	.login-but {
		width: 150rpx;
		height: 80rpx;
		text-align: center;
		line-height: 80rpx;
		font-size: 25rpx;
		background-color: #07C160;
		color: #fff;
		;
	}

	.kazu {
		font-size: 24rpx;
		font-weight: 500;
		color: #7B7D80;
		margin-top: 24rpx;
	}

	.buttons {
		width: 686rpx;
		height: 96rpx;
		background: #FD8B00;
		border-radius: 88rpx;
		color: #FFFFFF;
		font-size: 32rpx;
		font-weight: bold;
		text-align: center;
		line-height: 96rpx;
		margin-top: 168rpx;
	}
</style>